<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>转账</title>
</head>
<body>
<!--<form action="" method="post">
    {% csrf_token %}
    <table cellspacing="0px" cellpadding="5px" width="50%" border="1px">
        <tbody>
        <tr>
            <td>邮箱</td>
            <td><input type="email" name="email"></td>
        </tr>
        <tr>
            <td>金额</td>
            <td><input type="number" name="money"></td>
        </tr>
        <tr>
            <td></td>
            <td><button type="submit">确认转账</button></td>
        </tr>
        </tbody>
    </table>
</form>-->
<table cellspacing="0px" cellpadding="5px" width="50%" border="1px">
    <tbody>
    <tr>
        <td>邮箱</td>
        <td><input type="email" name="email"></td>
    </tr>
    <tr>
        <td>金额</td>
        <td><input type="number" name="money"></td>
    </tr>
    <tr>
        <td></td>
        <td><button type="submit" id="submit">确认转账</button></td>
    </tr>
    </tbody>
</table>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js" integrity="sha512-bLT0Qm9VnAYZDflyKcBaQ2gg0hSYNQrJ8RilYldYQ1FxQYoCLtUjuuRuZo+fjqhx/qtq/1itJ0C2ejDxltZVFg==" crossorigin="anonymous"></script>
<script>
    /**
     * TODO: 获取cookie
     * */
    function getCookie(name) {
        var cookieValue = null;
        if (document.cookie && document.cookie !== '') {
            var cookies = document.cookie.split(';');
            for (var i = 0; i < cookies.length; i++) {
                var cookie = jQuery.trim(cookies[i]);
                // Does this cookie string begin with the name we want?
                if (cookie.substring(0, name.length + 1) === (name + '=')) {
                    cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                    break;
                }
            }
        }
        return cookieValue;
    }
    $(function () {
        $('#submit').click(function (event) {
            {#TODO: 阻止默认点击事件#}
            event.preventDefault();
            email = $('input[name="email"]').val()
            money = $('input[name="money"]').val()
            csrftoken = getCookie('csrftoken')
            $.ajax({
                url: '/transfer/',
                method: 'post',
                headers: {
                      'X-CSRFToken': csrftoken
                },
                data: {
                    email,
                    money,
                    {#TODO: form中添加csrfmiddlewaretoken#}
                    {#'csrfmiddlewaretoken': csrftoken#}
                },
                success(res){
                    console.log(res)
                },
                error(error){
                    console.log(error)
                }
            });
        });
    });
</script>
</body>
</html>